import { Component } from 'react';
import './Baidu.scss';
import BdLogo from '../../components/content/baidu/BdLogo';
import BdSearch from '../../components/content/baidu/BdSearch';
import BdList from '../../components/content/baidu/BdList';
class Baidu extends Component {
  constructor(props) {
    super(props);
    this.state = {
      indexs: [0, 3, 1, 4, 2, 5],
      searchArr: [
        '一组海报带你看活力中国',
        '1媒体：胡鑫宇录音笔解析今日出结果',
        '2专家称年轻时不应为钱去选择工作',
        '3多重部署为消费复苏添信心',
        '4胡鑫宇家属:遗体在学校后山粮库找到',
        '5父女俩合力救下坠水1车5人',
        '6中国开门红 为世界经济增添暖意',
        '7媒体:录音笔在胡鑫宇遗体边墙洞发现',
        '8国家电网董事长年薪90万',
        '9圆梦乘组的新春生活',
        '10胡鑫宇曾写下:如果不活了将会怎么样',
        '11河北一滑雪场禁止游客教亲友滑雪',
        '12新闻1dlkj啥地方科技阿三',
        '13新闻阿和对方回复的',
        '14新闻阿公司的风格的',
        '15新闻545顿发送搭嘎',
        '16新闻阿规范好可怜',
        '17新闻阿士大夫撒的',
        '冲刺元月“开门红”',
        '5省份宣布实现人口正增长',
        '提前还房贷利大于弊吗',
        '这一看就是咱中国的空间站',
        '中方回应美将禁止向华为提供产品',
        'CH.1.1短期不会引起本土大规模流行',
        'f发的说法红”',
        '阿拉开始的解放路口',
        '看到付款了疯狂',
        '即可了解到会计法',
        '放到里三角案例反馈记录',
        'CH.1.爱空间的福利卡倒计时',
      ],
    };
  }
  // 换一换
  topChange = () => {
    this.setState({
      indexs: this.state.indexs.every((item) => item > 23)
        ? [0, 3, 1, 4, 2, 5]
        : this.state.indexs.map((item) => item + 6),
    });
  };
  render() {
    console.log(this.props,'百度组件接收到的props');
    return (
      <div className="baidu-box">
        {/* title */}
        <header className="title">百度首页</header>
        {/* logo */}
        <BdLogo />
        {/* 搜索框 */}
        <BdSearch searchArr={this.state.searchArr} />
        {/*热搜列表*/}
        <BdList
          searchArr={this.state.searchArr}
          indexs={this.state.indexs}
          topChange={this.topChange}
        />
      </div>
    );
  }
}

export default Baidu;
